<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <meta content="text/html; charset=ISO-8859-1"
      http-equiv="Content-Type">
    <title>Actions</title>
    <meta name="order" content="09" />
  </head>
  <body>
    <h2>Actions</h2>
    <p>There are cases that you may want your shape has a way user can quickly change its properties to a specific condition.
    For example changing the width and height of a rectangle to the same value, changing the border color of a shape to a color
    with the same HUE of the background but darker... The traditional way users must do is to do the calculation themselves and
    change each of the properties to desired value.
    </p>
    <p>
        Pencil introduces the concept of Action in which stencil developers can define a routine to perform calculation
        and make changes to properties in a batch. 
    </p>
    <p>
        The following example show how an Action is define to allow users quickly change the rectangle to a square:
    </p>
      
<pre name="code" class="xml"><![CDATA[
<Shape id="RoundedRect" displayName="Rectangle" icon="...">
  <Properties>
    ...
  </Properties>
  <Behaviors>
    ...
  </Behaviors>
  <Actions>
    <Action id="makeSquares" displayName="Make Squared">
      <Impl>
          var box = this.getProperty("box");
          box.w = Math.max(box.w, box.h);
          box.h = box.w;
          this.setProperty("box", box);
      </Impl>
    </Action>
  </Actions>
  <p:Content xmlns:p="http://www.evolus.vn/Namespace/Pencil"
             xmlns="http://www.w3.org/2000/svg">
    <rect id="rrRect" x="0" y="0" />
  </p:Content>
</Shape>
]]></pre>
    <p>In Action, the shape properties are modified and will be applied
      immediately to objects refer to these properties. This above code
      is simple, <code>box.h</code> is forced to equal to <code>box.w</code> and then the
      rectangle becomes a square. Please note also that in the context of action execution, the keyword <code>this</code>
      is bound to the shape itself so that you can retrieve an set the property values via it.</p>
  </body>
</html>
